﻿<!DOCTYPE html>
<html>

<head id="Head1" runat="server">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>检验任务看板</title>
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
  <link rel="Shortcut Icon" href="../images/aecc.ico" type="image/x-icon" />
  <link rel="stylesheet" href="../StaticFiles/layui/dist/css/layui.css" />
  <link rel="stylesheet" href="../StaticFiles/layui/admin.css" />
  <link rel="stylesheet" href="../styles/pace.css" />
  <script type="text/javascript" src="../Scripts/pace.min.js"></script>
  <script type="text/javascript" src="../Scripts/json2.js"></script>
  <script type="text/javascript" src="../Scripts/jquery-1.11.2.min.js"></script>
  <style type="text/css">
    html {
      background-image: url(../images/bg.jpg);
      background-repeat: repeat-y;
    }

    .layui-card {
      background-color: transparent;
    }

    .layui-card-header {
      color: #fff;
      border: none;
      text-align: center;
      font-size: 20px;
      font-weight: bold;
      letter-spacing: 0.1em;
    }

    .layui-table-cell {
      text-align: center;
      color: #fff;
    }

    .layui-table {
      background-color: transparent !important;
    }

    .layui-table-view {
      margin-top: 0px;
    }

    .layui-table-header {
      background-color: transparent !important;
    }

    /*表格标题*/
    .layui-table-header .layui-table-cell {
      color: #FFF;
      font-size: 18px;
      font-family: '微软雅黑';
      font-weight: bold;
      margin: 0px 0px;
      height: 50px;
      line-height: 50px;
    }

    /*表格单元格*/
    .layui-table-cell {
      color: #FFF;
      font-size: 14px;
      font-family: "微软雅黑";
      margin: 0px 0px;
      height: 48px;
      line-height: 48px;
    }

    .layui-table tr:hover {
      background-color: transparent !important;
    }

    .layui-table thead tr {
      background-color: transparent !important;
    }

    .layui-laypage a,
    .layui-laypage span {
      color: #fff;
    }

    .layui-laypage .layui-laypage-skip {
      color: #fff;
    }

    .layui-table td,
    .layui-table th,
    .layui-table-col-set,
    .layui-table-fixed-r,
    .layui-table-grid-down,
    .layui-table-header,
    .layui-table-page,
    .layui-table-tips-main,
    .layui-table-tool,
    .layui-table-total,
    .layui-table-view,
    .layui-table[lay-skin=line],
    .layui-table[lay-skin=row] {
      border-color: #808080;
    }

    .layui-table-view .layui-table td,
    .layui-table-view .layui-table th {
      margin: 0;
      padding: 0;
    }
  </style>
</head>

<body>
  <!--[if lt IE 9]>
        <script src="../Scripts/pollyfills/html5.js"></script>
        <script src="../Scripts/pollyfills/response.js"></script>
        <script src="../Scripts/pollyfills/array.pollyfill.js"></script>
    <![endif]-->

  <div class="layui-row" style="padding: 0px 15px;">
    <div class="layui-col-md3">
      <div>
        <img src="../images/aeec_logo.png" alt="" height="60" />
      </div>
    </div>
    <div class="layui-col-md6" style="height: 60px; line-height: 60px; text-align: center;
            font-size: 35px; letter-spacing: 0.1em; color: #fff;">
      装配厂检验任务看板
    </div>
    <div class="layui-col-md3"
      style="height: 60px; line-height: 60px; text-align: right;font-size: 16px; font-weight: bold; color: #fff;"
      id="currentTime">
    </div>
  </div>
  <div class="layui-row layui-col-space5" style="margin:0 15px;">
    <div class="layui-col-md12">
      <table id="grid"></table>
    </div>
  </div>
  <script type="text/javascript" src="../StaticFiles/layui/dist/layui.js"></script>
  <script type="text/javascript">
    $(function () {

      function getUrlParam(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
        var r = window.location.search.substr(1).match(reg);  //匹配目标参数
        if (r != null) return unescape(r[2]); return null; //返回参数值
      };
      var $factoryid = getUrlParam('factoryid');

      var index = null;

      //点击分页按钮显示加载动画
      function BindPage() {
        $(".layui-table-page a[data-page],.layui-laypage-btn").click(function () {
          if (!$(this).hasClass("layui-disabled")) {
            index = layer.load(0, { shade: [0.5, '#000'], time: 1000 * 1000 });
          }
        });
      }

      // 页面右上方时钟
      function showTime() {
        var currentTime = new Date();
        var year = currentTime.getFullYear();
        var month = currentTime.getMonth() + 1;
        var date = currentTime.getDate();
        var day = currentTime.getDay();
        var hours = currentTime.getHours();
        var minutes = currentTime.getMinutes();
        var seconds = currentTime.getSeconds();
        var time = document.getElementById("currentTime");
        if (seconds < 10) {
          seconds = "0" + seconds;
        }
        if (minutes < 10) {
          minutes = "0" + minutes;
        }
        time.innerHTML = year + "年" + month + "月" + date + "日   " + hours + ":" + minutes + ":" + seconds;
      };
      setInterval(showTime, 500);

      layui.use(['layer', 'table'], function () {
        var table = layui.table;
        var layer = layui.layer;

        index = layer.load(0, { shade: [0.5, '#000'], time: 1000 * 1000 });
        var grid = table.render({
          elem: '#grid'
          , url: "../handler/board/ZSCheckMissionLookBoard.ashx"
          , method: 'POST'
          , cols: [[
            { type: 'numbers', title: '序号', width: 60, align: 'center' }
            , { field: 'ATTRIBUTEVALUE', title: '发动机号', align: 'center' }
            , { field: 'CONTAINERNO', title: '批次任务单', align: 'center', width: 300 }
            , { field: 'PRODUCTDESCRIPTION', title: '部件名称', align: 'center' }
            , { field: 'WORKFLOWSTEPNAME', title: '阶段', align: 'center', width: 120 }
            , { field: 'TEAMNAME', title: '小组', align: 'center' }
            , { field: 'HasCheck', title: '已检工序数', align: 'center' }
            , { field: 'WaitCheck', title: '待检工序数', align: 'center' }
            , {
              field: 'CREATEDATE', title: '提交时间', align: 'center',
              templet: function (d) {
                if (d.CREATEDATE === null) {
                  return;
                } else {
                  return d.CREATEDATE.split('T')[0];
                }
              }
            }
            , {
              field: 'SKIPHOUR', title: '等待时间', align: 'center',
              templet: function (d) {
                if (d.SKIPHOUR == 0) {
                  return '<span style="color:green;font-weight:bold;">' + d.SKIPHOUR + '小时 <i class="layui-icon layui-icon-time"></i></span>';
                } else {
                  return '<span style="color:red;font-weight:bold;">' + d.SKIPHOUR + '小时 <i class="layui-icon layui-icon-time"></i></span>';
                }
              }
            }
          ]]
          , where: {
            factoryid: $factoryid
          }
          , text: {
            none: '暂无相关数据'
          }
          , request: {
            pageName: 'page', //页码的参数名称，默认：page
            limitName: 'rows' //每页数据量的参数名，默认：limit
          }
          , page: {
            theme: '#009688'
          }
          , limit: 15
          , limits: [15, 30, 50]
          , done: function (res, curr, count) {
            BindPage();
            layer.close(index);
            $(".layui-laypage-limits select").change(function () {
              index = layer.load(0, { shade: [0.5, '#000'], time: 1000 * 1000 });
            });
          }
        });
      });
    });
  </script>
</body>

</html>